{extend name="public/base" /}
{block name="style"}
<style>
    .layui-table-body ,.layui-table-box,.layui-table-cell{
        overflow: visible;
    }
</style>
{/block}
{block name="content"}
<form class="layui-form layui-form-pane form-search" action="{:url()}" onsubmit="return false" method="post" autocomplete="off" data-table-id="orderTable">
    <div class="layui-form-item layui-inline">
        <label class="layui-form-label">用户名</label>
        <label class="layui-input-inline">
            <input name="email" value="" placeholder="" class="layui-input" type="text">
        </label>
    </div>
    <div class="layui-form-item layui-inline">
        <label class="layui-form-label">结算状态</label>
        <div class="layui-input-inline">
            <select name="status" lay-search class="layui-select">
                <option value='0'>全部</option>
                <option value='1'>待结算</option>
                <option value='2'>已经结算</option>
                <option value='-1'>无效结算</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item layui-inline">
        <label class="layui-form-label">盈亏</label>
        <div class="layui-input-inline">
            <select name="is_win" lay-search class="layui-select">
                <option value='0'>全部</option>
                <option value='1'>盈利</option>
                <option value='2'>亏损</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item layui-inline">
        <label class="layui-form-label">购买时间</label>
        <div class="layui-input-inline">
            <input data-date-range name="buy_time" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item layui-inline">
        <button class="layui-btn layui-btn-primary"><i class="layui-icon">&#xe615;</i>搜索</button>
    </div>
</form>
<table id="orderTable"  data-url="{:url('index')}" data-target-search="form.form-search"></table>
{/block}
{block name='script'}
<script>
    $(function () {
        $.menu.highlight_subnav("{:url('index')}")
        $('#orderTable').layTable({
            even: true,
            height: 'full',
            method: 'post',
            sort: {field: 'id', type: 'desc'},
            where:{status:0,email:"",is_win:0,buy_time:""},
            url: "{:url('index')}" ,
            page: true,
            cols: [[
                {checkbox: true, fixed: true},
                {field: 'id', title: 'ID', width: 100, align: 'center',sort:true},
                {field: 'username', title: '会员账号', width: 180, align: 'left',templet: function (d) {
                    return d.member.email;
                 }},
                {field: 'code', title: '交易对', width: 80, align: 'left',templet:function (d){
                    return d.market.code.toUpperCase()+"/USDT";
                }},
                {field: 'is_rise', title: '方向', width: 50, align: 'center',templet:function (d){
                    return d.is_rise ==1 ? "涨":"跌";
                }},
                {field: 'status', title: '状态', align: 'center', minWidth: 50,templet:function (d){
                   if (d.status==1) {
                       return "结算中";
                   } else if(d.status==2) {
                       return "已经结算";
                   } else {
                       return "结算废弃";
                   }
                }},
                {field: 'num', title: '	委托额度', align: 'center', minWidth: 100},
                {field: 'is_win', title: '盈亏状态', align: 'center', minWidth: 80,templet:function (d){
                    return d.is_win==1 ? "盈利":"亏损";
                }},
                {field: 'buy_price', title: '建仓单价', align: 'left', minWidth: 70},
                {field: 'sell_price', title: '平仓单价', align: 'left', minWidth: 70},
                {field: 'buy_time', title: '建仓时间', align: 'center', minWidth: 150},
                {field: 'ploss', title: '盈亏金额', align: 'left', minWidth: 70 ,templet:function (d){
                    if (d.ploss>0) {
                        return "<span style='color:#0ecb81;'>"+"+"+d.ploss+"</span>";
                    } else {
                        return "<span style='color:red;'>"+d.ploss+"</span>";
                    }
                 }},
                {field: 'control', title: '单控操作', align: 'center', minWidth: 170, templet: '#ControlTpl'},
                {toolbar: '#toolbar', title: '操作面板', align: 'center', minWidth: 120, fixed: 'right'}
            ]]
        });
        // 数据状态切换操作
        layui.form.on('select(control)', function (obj) {
            var index = layer.load();
            $.post("{:url('set')}",{id:obj.elem.id,control:obj.value},function (res){
                layer.close(index);
                 if (res && res.code==0) {
                     $.msg.success(res.msg)
                 } else {
                     $.msg.error(res.msg)
                 }
            },"json")

        });
    });
</script>

<!-- 数据状态切换模板 -->
<script type="text/html" id="ControlTpl">
    <div class="layui-input-inline" >
    <select name="switch"  {{-d.status==1?'':'disabled'}}  class="layui-select" lay-filter='control' id="{{d.id}}">
        <option value='0' {{-d.control==0?'selected':''}}  >正常</option>
        <option value='1' {{-d.control==1?'selected':''}} >盈利</option>
        <option value='2' {{-d.control==2?'selected':''}} >亏损</option>
    </select>
    </div>
</script>
<script type="text/html" id="toolbar">
    <a class="layui-btn layui-btn-sm" data-event-dbclick data-title="查看" data-modal='{:url("detail")}?id={{d.id}}'>查 看</a>
</script>
{/block}
